import 'package:flutter/material.dart';
import 'package:flutter_dva_hooks/store.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:todo_app/components/FontIcon.dart';
import 'package:todo_app/constants/DColor.dart';
import 'package:todo_app/layout/Gaps.dart';
import 'package:todo_app/models/getters.dart';
import 'package:todo_app/utils/AppNavigator.dart';
import 'package:todo_app/utils/PgyerUpgradeHelper.dart';
import 'package:todo_app/utils/mqtt/LocalMqttClient.dart';
import 'package:url_launcher/url_launcher_string.dart';

import 'group-page.dart';
import 'home-page.dart';
import 'me-page.dart';

class TabData {
  final String page;
  final String title;

  TabData(this.page, this.title);
}

final tabDataList = [
  TabData("home", '首页'),
  TabData("group", '分组'),
  TabData("me", '我的'),
];

class TabsPage extends StatefulHookWidget {
  const TabsPage({ required this.currentIndex, super.key});
  final int currentIndex;

  @override
  _TabsPageState createState() => _TabsPageState();
}

class _TabsPageState extends State<TabsPage> {
  @override
  Widget build(BuildContext context) {
    var store = useDvaStore();
    var meUid = store.rootState.system?.user?.id;
    final tabController = useTabController(initialLength: 3, initialIndex: widget.currentIndex);
    var upgrade = useCallback(() {
      PgyerUpgradeHelper.checkUpgrade().then((res) async {
        if(res != null) {
          var upgrade = await PgyerUpgradeHelper.showUpgradeConfirmDialog(res);
          if(upgrade && res.downloadURL != null) {
            launchUrlString(res.downloadURL!, mode: LaunchMode.externalNonBrowserApplication);
          }
        }
      });
    }, []);

    useEffect(() {
      tabController.index = widget.currentIndex;
      return () {};
    }, [widget.currentIndex]);

    useEffect(() {
      upgrade();
      LocalMqttClient.subscribe(meUid!);
      return () {};
    }, []);

    return Scaffold(
      body: TabBarView(
        controller: tabController,
        physics: const NeverScrollableScrollPhysics(),
        children: const [
          HomePage(),
          GroupPage(),
          MePage()
        ],
      ),
      bottomNavigationBar: Container(
        color: DColor.primary,
        child: TabBar(
          controller: tabController,
          indicatorColor: DColor.primary,
          onTap: (index) {
            AppNavigator.go('/tabs/${tabDataList[index].page}');
          },
          tabs: [
            Tab(
              text: "首页",
              height: 64.dp,
              iconMargin: EdgeInsets.only(bottom: 4.dp),
              icon: const FontIcon(icon: FontIcons.home3),
            ),
            Tab(
              text: "分组",
              height: 64.dp,
              iconMargin: EdgeInsets.only(bottom: 4.dp),
              icon: const FontIcon(icon: FontIcons.makeGroup),
            ),
            Tab(
              text: "我的",
              height: 64.dp,
              iconMargin: EdgeInsets.only(bottom: 4.dp),
              icon: const FontIcon(icon: FontIcons.user),
            ),
          ],
        ),
      ),
    );
  }
}